<template>
	<cl-drawer
		ref="drawer"
		:props="{
			title: `${type == 'add' ? '新增' : '修改'}定金部门参数`,
			size: '30%',
			appendToBody: true
		}"
		show-confirm
		confirm-text="提交"
		@close="reset"
		@confirm="submit"
		:saving="saving"
	>
		<el-card shadow="never">
			<el-form
				:model="form"
				:rules="rules"
				ref="form"
				label-width="100px"
				label-position="top"
				class="demo-form"
			>
				<el-form-item label="事业部" prop="biz_id">
					<cl-select
						v-model="form.biz_id"
						style="width: 100%"
						@change="changeBiz"
						:disabled="type == 'edit'"
					>
						<el-option
							v-for="item in business"
							:key="item.biz_id"
							:label="item.biz_name"
							:value="item.biz_id"
						></el-option>
					</cl-select>
				</el-form-item>
				<el-form-item label="所属部门" prop="dept_id">
					<cl-cascader
						style="width: 100%"
						clearable
						:key="0"
						v-model="form.dept_id"
						:options="deptList"
						:props="{
							checkStrictly: false,
							value: 'dept_id',
							label: 'dept_name'
						}"
						filterable
					/>
				</el-form-item>
				<template>
					<el-form-item label="银联-C扫B-商户号" prop="mid">
						<el-input
							v-model="form.mid"
							placeholder="请输入银联-C扫B-商户号"
							type="text"
						>
						</el-input>
					</el-form-item>
					<el-form-item label="银联-C扫B-终端号" :required="true" prop="tid">
						<el-input v-model="form.tid" placeholder="请输入银联-C扫B-终端号" />
					</el-form-item>
				</template>
			</el-form>
		</el-card>
	</cl-drawer>
</template>

<script>
import { delEmptyChildren } from "@/utils";

export default {
	data() {
		return {
			form: {
				mid: "",
				tid: "",
				biz_id: "",
				dept_id: []
			},
			rules: {
				biz_id: [{ required: true, message: "请选择事业部" }],
				dept_id: [{ required: true, message: "请选择部门" }],
				mid: [{ required: true, message: "请输入银联-C扫B-商户号" }],
				tid: [{ required: true, message: "请输入银联-C扫B-终端号" }]
			},
			saving: false,
			deptList: [], //部门
			type: ""
		};
	},
	created() {
		this.form.biz_id = this.getCurrBiz();
	},
	methods: {
		open(data = {}, type) {
			this.type = type;
			if (type == "edit") {
				this.form = { ...data };
			}
			this.getDeptList();
			this.$refs.drawer.create();
		},
		//切换事业部
		changeBiz() {
			this.form.dept_id = [];
			this.getDeptList();
		},
		// 部门
		async getDeptList() {
			const { biz_id } = this.form;
			this.deptList = [];
			if (!biz_id) return;
			const data = await this.$service.dept.list({
				parent_id: 0,
				is_store: 0,
				biz_id
			});
			this.deptList = delEmptyChildren(data);
		},
		submit() {
			this.$refs.form.validate(async valid => {
				if (!valid) return;
				this.saving = true;
				const { bsc_data, ...args } = this.form;
				let form = { ...args };
				await this.$service.syspay[this.type == "add" ? "deptadd" : "deptedits"](form).done(
					() => {
						this.saving = false;
					}
				);

				this.$refs.drawer.close();
				this.reset();
				this.$message.success(`${this.type == "add" ? "新增" : "修改"}成功`);
				this.$emit("confirm");
			});
		},
		reset() {
			this.$refs.form.resetFields();
			this.$resetFields(this.form);
			this.form.biz_id = this.getCurrBiz();
		}
	}
};
</script>

<style></style>
